<template>
  <div class="xd"  style="color: #333;">
    <div class="jz" style="width: 1200px">
      <div style="margin-top: 10px">
        <a href="https://www.ep12.com/a/hot/2023gnzjz/">
          <img class="xsgb " src="../../assets/img/2023glnyxxzjz1.jpg" title="广西桂林农业学校2023年职业教育活动周系列宣传精彩上线" />
        </a>
      </div>
      <!--    悬停暂停跑马灯-->
      <div class="ddisp fz_16 pad_10_0 czjz_flex wz_white white_a" style="background-color:#0069df;margin: 10px 0 20px 0">
        <div class="centerdq wz_jz" style="width: 100px">滚动资讯：</div>
        <div class="centerdq" style="width: calc(100% - 100px)">
          <div id="wrap">
            <div id="first">
              <ul class="ulli wz_white bhh add_bor" >
                <li class="xsgb" @click="addList(item,[
                  {tit:'首页',path:'homeList'},
                  {tit:'新闻中心',path:'xinwenzhongxin'},
                  {tit:'聚焦',path:'jujiao'}
                ])" v-for="(item,index) in informationList" :key="index">{{ item.title }}</li>
              </ul>
            </div>
            <div id="last">
              <ul class="ulli wz_white bhh add_bor"  style="list-style-type: circle">
                <li class="xsgb" @click="addList(item,[
                  {tit:'首页',path:'homeList'},
                  {tit:'新闻中心',path:'xinwenzhongxin'},
                  {tit:'聚焦',path:'jujiao'}
                ])" v-for="(item,index) in informationList" :key="index">{{ item.title }}</li>
              </ul>
            </div>
          </div>
        </div>
      </div>

      <!--    轮播图 职教聚焦-->
      <div class="xyy bor_10 animate__animated animate__backInRight" style="min-width: 1200px;padding: 20px 0">
        <div class="wh_f">
          <div class="centerdq" style="flex: 52">
            <div class="jz">
              <Carousel class="jz" style="width: 600px" :stop-propagation="false"></Carousel>
            </div>
          </div>
          <div class="centerdq" style="flex: 48;min-height: 360px">
            <div class="wh_9-5 jz">
              <div>
                <div class="ddisp">
                  <div class="fz_22"><a href=""><span class="titColor">职教聚焦</span></a></div>
                  <div class="gd wz_rigdq xsgb"><a href=""><span class="mag_r-5 wz_black">更多</span></a><span class="centerdq"><img style="margin-right: 10px" src="../../assets/img/mores.png" height="15" width="15"/></span></div>
                </div>
              </div>
              <div v-for="(item,index3) in zhijiaojujiaoList" :key="index3" v-if="zhijiaojujiaoList && item.flag=='recommend'">
                <div class="pad_10_0">
                  <a class="animated bounce" :title="item.title" @click="addList(item,[
                  {tit:'首页',path:'homeList'},
                  {tit:'新闻中心',path:'xinwenzhongxin'},
                  {tit:'聚焦',path:'jujiao'}
                ])">
                    <span class="wz_black em fz_20 ccsl_1">{{ item.title }}</span>
                  </a>
                </div>
                <div class="fz_13">
                <span class="hh">
                  <div class="disb ccsl_2 hh wz_huihui" style="text-indent: 2em;">
                    {{item.description}}
                  </div>
                </span>
                  <a><span @click="addList(item,[
                  {tit:'首页',path:'homeList'},
                  {tit:'新闻中心',path:'xinwenzhongxin'},
                  {tit:'聚焦',path:'jujiao'}
                ])" class="wz_red">【查看全文】</span></a>
                </div>
              </div>

              <!--        职教聚焦-->
              <div class="fz_17">
                <ul class="uuu add">
                  <li v-for="(item,index) in zhijiaojujiaoList" :key="index" v-if="zhijiaojujiaoList && item.flag!='recommend'  && index<8">
                    <a @click="addList(item,[
                  {tit:'首页',path:'homeList'},
                  {tit:'新闻中心',path:'xinwenzhongxin'},
                  {tit:'中职动态',path:'jujiao'}
                ])">
                      <span class="wz_black">{{ item.title }}</span>
                    </a>
                  </li>
                </ul>
              </div>
            </div>

          </div>
        </div>
      </div>
      <div class="mw_1200" style="overflow-x: hidden;padding: 0 2px">
        <!--      通知 培训 招聘 -->
        <div class="xyy animate__animated animate__backInLeft split_3 bor_10 pad_10_30 mag_tb_20" style="min-height: 400px">
          <div class="topdq">
            <div class="wh_9 jz">
              <div class="pad_10_0">
                <div class="ddisp xsgb baxx wh_f">
                  <div @click="bddList(365,[
                  {tit:'首页',path:'homeList'},
                  {tit:'公告直通车',path:'middleList'}
                ])" @mouseover="addTab(1)" :class="stateId==1?'wz_redbig':''" class="flex_1" style="line-height: 20px">通知公告</div>
                  <div @click="bddList(366,[
                  {tit:'首页',path:'homeList'},
                  {tit:'新闻中心',path:'middleList'},
                  {tit:'培训信息',path:'middleList'}
                ])" @mouseover="addTab(2)" :class="stateId==2?'wz_redbig':''"  class="wz_jz flex_1" style="line-height: 20px">培训信息</div>
                  <div @click="bddList(384,[
                  {tit:'首页',path:'homeList'},
                  {tit:'教师招聘',path:'middleList'},
                ])" @mouseover="addTab(3)" :class="stateId==3?'wz_redbig':''" class="wz_rigdq flex_1" style="line-height: 20px">招聘信息</div>
                </div>
              </div>
              <!--        通知 培训 招聘-->
              <div class="pad_5_0">
                <div v-if="stateId==1" class="fz_14 wh_9-8 jz">
                  <div class="pad_5_0" v-for="(item,index5) in tongzhigonggaoList" :key="index5" v-if="tongzhigonggaoList && index5<8">
                    <div class="hh ccsl_2" @click="addList(item,[
                  {tit:'首页',path:'homeList'},
                  {tit:'新闻中心',path:'xinwenzhongxin'},
                  {tit:'聚焦',path:'jujiao'}
                ])">
                      <span class="em" style="color: #1381e5">通知</span><span style="margin: 0 10px">/</span>
                      <span><a :title="item.title" @click="addList(item,[
                  {tit:'首页',path:'homeList'},
                  {tit:'新闻中心',path:'xinwenzhongxin'},
                  {tit:'聚焦',path:'jujiao'}
                ])"><span class="aColor">111{{ item.title }}</span></a></span>
                    </div>
                    <div class="wz_rigdq"><span class="fz_12" style="color: #7a7a7a">{{ item.createtime | date }}</span></div>
                  </div>
                </div>
                <div v-if="stateId==2" class="fz_14 wh_9-8 jz">
                  <div class="pad_5_0"  v-for="(item,index6) in peixunxinxiList" :key="index6" v-if="peixunxinxiList && index6<8">
                    <div class="hh ccsl_2">
                      <span class="em" style="color: #1381e5">培训</span><span style="margin: 0 10px">/</span>
                      <span><a :title="item.title" @click="addList(item,[
                  {tit:'首页',path:'homeList'},
                  {tit:'新闻中心',path:'xinwenzhongxin'},
                  {tit:'聚焦',path:'jujiao'}
                ])"><span class="aColor">{{ item.title }}</span></a></span>
                    </div>
                    <div class="wz_rigdq"><span class="fz_12" style="color: #7a7a7a">{{ item.createtime | date }}</span></div>
                  </div>

                </div>
                <div v-if="stateId==3" class="fz_14 wh_9-8 jz">
                  <div class="pad_5_0" v-for="(item,index7) in zhaopinxinxiList" :key="index7" v-if="zhaopinxinxiList && index7<8">
                    <div class="hh ccsl_2">
                      <span class="em" style="color: #1381e5">招聘</span><span style="margin: 0 10px">/</span>
                      <span><a :title="item.title" @click="addList(item,[
                  {tit:'首页',path:'homeList'},
                  {tit:'新闻中心',path:'xinwenzhongxin'},
                  {tit:'聚焦',path:'jujiao'}
                ])"><span class="aColor">{{ item.title }}</span></a></span>
                    </div>
                    <div class="wz_rigdq"><span class="fz_12" style="color: #7a7a7a">{{ item.createtime | date }}</span></div>
                  </div>

                </div>
              </div>
            </div>
          </div>
          <!--      中职动态-->
          <div class="topdq">
            <div class="wh_9 jz">
              <div class="ddisp">
                <div class="fz_22 pad_10_0"><a href=""><span class="titColor">中职动态</span></a></div>
                <div class="gd wz_rigdq xsgb"><a @click="addList(item,[
                  {tit:'首页',path:'homeList'},
                  {tit:'新闻中心',path:'xinwenzhongxin'},
                  {tit:'聚焦',path:'jujiao'}
                ])"><span class="mag_r-5 wz_black">更多</span></a><span class="centerdq"><img style="margin-right: 10px" src="../../assets/img/mores.png" height="15" width="15"/></span></div>
              </div>

              <div v-for="(item,index8) in zhongzhidongtaiList" :key="index8" v-if="zhongzhidongtaiList && index8<1">
                <div class="split_2 img_100" v-if="item.flag=='recommend'">
                  <div>
                    <a  @click="addList(item,[
                  {tit:'首页',path:'homeList'},
                  {tit:'新闻中心',path:'xinwenzhongxin'},
                  {tit:'聚焦',path:'jujiao'}
                ])"><img class="bor_5" :src="$store.state.imageUrltitle+item.image" height="110"/></a>
                  </div>
                  <div class="hh topdq">
                    <div class="wh_9 jz">
                      <a  @click="addList(item,[
                  {tit:'首页',path:'homeList'},
                  {tit:'新闻中心',path:'xinwenzhongxin'},
                  {tit:'聚焦',path:'jujiao'}
                ])"><span class="wz_black em aColor">{{ item.title }}</span></a>
                    </div>
                  </div>
                </div>
              </div>

              <div class="hh">
                <div class="ccsl_2 hh mag_10_0" v-for="(item,index9) in zhongzhidongtaiList" :key="index9" v-if="zhongzhidongtaiList && item.flag!='recommend' && index9<6">
                  <a><span @click="addList(item,[
                  {tit:'首页',path:'homeList'},
                  {tit:'新闻中心',path:'xinwenzhongxin'},
                  {tit:'聚焦',path:'jujiao'}
                ])" class="wz_black aColor">{{ item.title }}</span></a>
                </div>
              </div>
            </div>

          </div>
          <!--      高职动态-->
          <div class="topdq">
            <div class="wh_9 jz">
              <div class="ddisp">
                <div class="fz_22 pad_10_0"><a href=""><span class="titColor">高职动态</span></a></div>
                <div class="gd wz_rigdq xsgb"><a href=""><span class="mag_r-5 wz_black">更多</span></a><span class="centerdq"><img style="margin-right: 10px" src="../../assets/img/mores.png" height="15" width="15"/></span></div>
              </div>
              <div v-for="(item,index) in gaozhidongtaiList" :key="index+ '-' + Math.random()" v-if="gaozhidongtaiList && item.flag=='recommend' && index<1">
                <div class="split_2 img_100">
                  <div>
                    <a  @click="addList(item,[
                  {tit:'首页',path:'homeList'},
                  {tit:'新闻中心',path:'xinwenzhongxin'},
                  {tit:'聚焦',path:'jujiao'}
                ])"><img class="bor_5" :src="$store.state.imageUrltitle+item.image" height="110"/></a>
                  </div>
                  <div class="hh">
                    <div class="wh_9 jz">
                      <a  @click="addList(item,[
                  {tit:'首页',path:'homeList'},
                  {tit:'新闻中心',path:'xinwenzhongxin'},
                  {tit:'聚焦',path:'jujiao'}
                ])"><span class="wz_black em aColor">{{ item.title }}</span></a>
                    </div>
                  </div>
                </div>
              </div>
              <div class="hh">
                <div class="mag_t-20" v-for="(item,index) in gaozhidongtaiList" :key="index+ '-' + Math.random()" v-if="gaozhidongtaiList && item.flag!='recommend' && index<6">
                  <div class="ccsl_2">
                    <a><span @click="addList(item,[
                  {tit:'首页',path:'homeList'},
                  {tit:'新闻中心',path:'xinwenzhongxin'},
                  {tit:'聚焦',path:'jujiao'}
                ])" class="wz_black aColor">{{ item.title }}</span></a>
                  </div>
                </div>
              </div>

            </div>
          </div>
        </div>
        <div style="margin-top: 10px">
          <a href="https://www.ep12.com/plus/list.php?tid=5400"><img  class="xsgb" src="../../assets/img/2023jnds1.jpg" title="新媒体招生" /></a>
        </div>
<!--        职教榜样 图说 政策导读 专访策划-->
        <div class="xyy bor_10 mag_tb_20 split_3 pad_b_20">
          <div class="topdq">
            <div class="wh_9 jz">
              <div class="ddisp">
                <div class="fz_22 pad_10_0"><a href=""><span class="wz_red">职教榜样</span></a></div>
                <div class="gd wz_rigdq xsgb"><a href=""><span class="mag_r-5 wz_black">更多</span></a><span class="centerdq"><img style="margin-right: 10px" src="../../assets/img/mores.png" height="15" width="15"/></span></div>
              </div>

              <div>
                <div class="fz_14 em pad_5_0" style="background-color: #E7E7E7">
                  <span class="mag_l_2" style="color: #6a6a6a;">榜样园丁</span>
                </div>
                <div class="split_4_6 pad_10_0" v-for="(item,index) in bangyangyuandingList" :key="index+ '-' + Math.random()" v-if="bangyangyuandingList">
                  <div class="img_100 topdq">
                    <a><img :src="$store.state.imageUrltitle+item.image"></a></div>
                  <div class=" topdq">
                    <div class="hh fz_14 wh_9-5 jz">
                      <h3 class="em fz_18 pad_10_0">{{ item.title }}</h3>
                      <p class="ppp">
                        {{item.description}}
                        <a  @click="addList(item,[
                  {tit:'首页',path:'homeList'},
                  {tit:'新闻中心',path:'xinwenzhongxin'},
                  {tit:'聚焦',path:'jujiao'}
                ])"><span class="wz_red">【查看全文】</span></a>
                      </p>
                    </div>
                  </div>
                </div>
              </div>

              <div>
                <div class="fz_14 em pad_5_0" style="background-color: #E7E7E7">
                  <span class="mag_l_2" style="color: #6a6a6a;">榜样学生</span>
                </div>
                <div class="split_4_6 pad_10_0" v-for="(item,index) in bangyangxueshengList" :key="index+ '-' + Math.random()" v-if="bangyangxueshengList">
                  <div class="img_100 topdq">
                    <a><img :src="$store.state.imageUrltitle+item.image"></a></div>
                  <div class=" topdq">
                    <div class="hh fz_14 wh_9-5 jz">
                      <h3 class="em fz_18 pad_10_0">{{ item.title }}</h3>
                      <p class="ppp">
                        {{item.description}}
                        <a  @click="addList(item,[
                  {tit:'首页',path:'homeList'},
                  {tit:'新闻中心',path:'xinwenzhongxin'},
                  {tit:'聚焦',path:'jujiao'}
                ])"><span class="wz_red">【查看全文】</span></a>
                      </p>
                    </div>
                  </div>
                </div>
              </div>

            </div>
          </div>
<!--          图说-->
          <div class="topdq">
            <div class="wh_9-5 jz">
              <div class="ddisp">
                <div class="fz_22 pad_10_0"><a><span class="wz_red">图说</span></a></div>
                <div class="gd wz_rigdq xsgb"><a><span class="mag_r-5 wz_black">更多</span></a><span class="centerdq"><img style="margin-right: 10px" src="../../assets/img/mores.png" height="15" width="15"/></span></div>
              </div>
              <div class="split_2">
                <div class="" v-for="(item,index) in tushuoList" :key="index+ '-' + Math.random()" v-if="item.flag=='recommend'">
                  <div class="xd wh_9-5 jz"style="height: 119px">
                    <a @click="addList(item,[
                  {tit:'首页',path:'homeList'},
                  {tit:'新闻中心',path:'xinwenzhongxin'},
                  {tit:'聚焦',path:'jujiao'}
                ])"><img class="bor_5 wh_max"style="height: 119px" :src="$store.state.imageUrltitle+item.image" /></a>
                    <div class="jd ba_gr wz_white wh_max bor_b-5 pad_5_0 fz_11" style="bottom: 0;background-color: rgba(0, 0, 0, 0.6);">
                      <div class="ccsl_1">
                        <p class="pp">{{ item.title }}</p>
                      </div>
                    </div>
                  </div>
                </div>
              </div>
              <div class="pad_5_0 hh tab_b mag_b-10" v-for="(item,index) in tushuoList" :key="index+ '-' + Math.random()" v-if="item.flag!='recommend'">
                <div class="ccsl_1">
                  <a :title="item.title" target="_blank">
                  <span @click="addList(item,[
                  {tit:'首页',path:'homeList'},
                  {tit:'新闻中心',path:'xinwenzhongxin'},
                  {tit:'聚焦',path:'jujiao'}
                ])" class="wz_black aColor">{{ item.title }}</span>
                  </a>
                </div>
              </div>
<!--政策导读-->
              <div class="ddisp">
                <div class="fz_22 pad_10_0"><a href=""><span class="wz_red">政策导读</span></a></div>
                <div class="gd wz_rigdq xsgb"><a href=""><span class="mag_r-5 wz_black">更多</span></a><span class="centerdq"><img style="margin-right: 10px" src="../../assets/img/mores.png" height="15" width="15"/></span></div>
              </div>
              <div class="pad_5_0 tab_b mag_10_0" v-for="(item,index) in zhengcedaoduList" :key="index+ '-' + Math.random()" v-if="item.flag!='recommend'&& index<6">
                <div class="ccsl_1">
                  <a :title="item.title" target="_blank">
                  <span @click="addList(item,[
                  {tit:'首页',path:'homeList'},
                  {tit:'新闻中心',path:'xinwenzhongxin'},
                  {tit:'聚焦',path:'jujiao'}
                ])" class="wz_black aColor">{{ item.title }}</span>
                  </a>
                </div>
              </div>
            </div>
          </div>
<!--          专访策划-->
          <div  class="topdq">
            <div class="wh_9-5 jz">
              <div class="jz">
                <div class="ddisp">
                  <div class="fz_22 pad_10_0"><a href=""><span class="wz_red">专访•策划</span></a></div>
                  <div class="gd wz_rigdq xsgb"><a href=""><span class="mag_r-5 wz_black">更多</span></a><span class="centerdq"><img style="margin-right: 10px" src="../../assets/img/mores.png" height="15" width="15"/></span></div>
                </div>
              </div>
              <div class="split_2 img_100"  v-for="(item,index) in zhuanfangcehuaList" :key="index+ '-' + Math.random()" v-if="item.flag=='recommend'">
                <div>
                  <a @click="addList(item,[
                  {tit:'首页',path:'homeList'},
                  {tit:'新闻中心',path:'xinwenzhongxin'},
                  {tit:'聚焦',path:'jujiao'}
                ])"><img height="119" class="bor_5" :src="$store.state.imageUrltitle+item.image"/></a>
                </div>
                <div class="hh topdq">
                  <div class="wh_9 jz">
                    <a :title="item.title" @click="addList(item,[
                  {tit:'首页',path:'homeList'},
                  {tit:'新闻中心',path:'xinwenzhongxin'},
                  {tit:'聚焦',path:'jujiao'}
                ])"><span class="wz_black em aColor">{{ item.title }}</span></a>
                  </div>
                </div>
              </div>
              <div>
                <div class="pad_15_0"   v-for="(item,index) in zhuanfangcehuaList" :key="index+ '-' + Math.random()" v-if="item.flag!='recommend' && index<8">
                  <div class="ccsl_1">
                    <a :title="item.title" target="_blank">
                  <span @click="addList(item,[
                  {tit:'首页',path:'homeList'},
                  {tit:'新闻中心',path:'xinwenzhongxin'},
                  {tit:'聚焦',path:'jujiao'}
                ])" class="wz_black aColor">
										{{ item.title }}
									</span>
                    </a>
                  </div>
                </div>
              </div>
            </div>

          </div>
        </div>
<!--        热点专题-->
        <div class="xyy bor_10 pad_10_0 mag_tb_20">
          <div class="boxs pad_0_20">
            <div class="ddisp">
              <div class="fz_22 boxs" style="padding: 0 0 10px"><a href=""><span class="titColor">热点专题</span></a></div>
              <div class="gd wz_rigdq xsgb"><a href=""><span class="mag_r-5 wz_black">更多</span></a><span class="centerdq"><img style="margin-right: 10px" src="../../assets/img/mores.png" height="15" width="15"/></span></div>
            </div>
            <div class="pad_20_0 split_4 xsgb">
              <div @click="addList(item,[
                  {tit:'首页',path:'homeList'},
                  {tit:'新闻中心',path:'xinwenzhongxin'},
                  {tit:'聚焦',path:'jujiao'}
                ])" v-for="(item,index) in redianzhuantiList" :key="index+ '-' + Math.random()" v-if="index < 4">
                <div class="wh_9 jz">
                  <div class="img_100">
                    <a><img class="bor_5" :src="$store.state.imageUrltitle+item.image" height="170"/></a>
                  </div>
                  <div class="wz_jz pad_10_0">
                    <div class="ccsl_1">
                      <a><span class="aColor">{{item.title}}</span></a>
                    </div>

                  </div>
                </div>
              </div>
            </div>
          </div>

        </div>
<!--        职教视点-->
        <div class="xyy bor_10 mag_tb_20 pad_b_20">
          <div class="split_45_55 boxs" style="padding: 0 20px">
            <div>
              <div class="ddisp">
                <div class="fz_22 boxs" style="padding: 10px 0 10px"><a href=""><span class="titColor">职教视点</span></a></div>
                <div class="gd wz_rigdq xsgb"><a href=""><span class="mag_r-5 wz_black"></span></a><span class="centerdq"></span></div>
              </div>
            </div>
            <div class="split_7_3">
              <div class="split_4">
                <div class="gd">
                  <a href=""><span class="ba_white aColor">院校宣传片</span></a>
                </div>
                <div class="gd">
                  <a href=""><span class="ba_white aColor">专业介绍</span></a>
                </div>
                <div class="gd">
                  <a href=""><span class="ba_white aColor">培训课程</span></a>
                </div>
                <div class="gd">
                  <a href=""><span class="ba_white aColor">干货分享</span></a>
                </div>

              </div>
              <div class="gd wz_rigdq xsgb">
                  <a href="">
                    <span class="mag_r-5 wz_black">更多</span>
                  </a>
                  <span class="centerdq">
                  <img style="margin-right: 10px" src="../../assets/img/mores.png" height="15" width="15"/>
                  </span>
              </div>
            </div>
          </div>

          <div class="split_35_65">
            <div class="topdq">
              <div class="wh_9 jz xd xsgb" v-for="(item,index) in zhijiaoshidianList" :key="index" v-if="zhijiaoshidianList && item.flag=='recommend'">
                <div class="img_100">
                  <video style="width: 100%;" :src="$store.state.imageUrltitle+item.video"></video>
<!--                  <a ><img :src="职教视点.图片链接" alt=""></a>-->
                </div>
                <div class="hh jd wh_max wz_white pad_10_0" style="bottom: 2px;background-color: rgba(0, 0, 0, .7);">
                  <div class="wh_9 jz wz_jz ccsl_1 hh"><span>{{ item.title }}</span></div>
                </div>
                <a ><i @click="addList(item,[
                  {tit:'首页',path:'homeList'},
                  {tit:'新闻中心',path:'xinwenzhongxin'},
                  {tit:'聚焦',path:'jujiao'}
                ])" class="iconfont icon-bofang jd wz_white jdjz" style="font-size: 50px;"></i></a>
              </div>
            </div>
            <div class="ddisp topdq">
              <div class="wh_2-5 topdq" v-for="(item,index) in zhijiaoshidianList" :key="index" v-if="zhijiaoshidianList && item.flag==''">
                <div class="wh_9-5 jz">
                  <div class="img_100 xd xsgb czjz_flex" @mousemove="videoadd(index)" @mouseout="videoedd()">
                    <video style="width: 100%;" :src="$store.state.imageUrltitle+item.video"></video>
                    <div class="wz_white whe_max jd" :class="videoid==index+1?'':'yrba'" style="top: 0%;">
                      <a @click="addList(item,[
                  {tit:'首页',path:'homeList'},
                  {tit:'新闻中心',path:'xinwenzhongxin'},
                  {tit:'聚焦',path:'jujiao'}
                ])"><i class="iconfont icon-bofang jdjz jd " style="font-size: 50px"></i></a>
                    </div>
                  </div>
                  <div class="hh pad_10_0 ccsl_1 hh">
                    <a @click="addList(item,[
                  {tit:'首页',path:'homeList'},
                  {tit:'新闻中心',path:'xinwenzhongxin'},
                  {tit:'聚焦',path:'jujiao'}
                ])"><span class="aColor">{{item.title}}</span></a>
                  </div>
                </div>
              </div>
            </div>
          </div>
        </div>
<!--        聚焦20大-->
        <div  class="mag_tb_20">
          <a href="https://www.ep12.com/a/hot/20dajs/index.html"><img class="" src="../../assets/img/xx20djs2.png"/></a>
        </div>
<!--        魅力中职-->
        <div  class="mag_tb_20 bor_10 xyy pad_b_20">
          <div class="boxs" style="padding: 0 20px">
            <div class="ddisp">
              <div class="fz_22 pad_10_0 boxs" style="padding: 10px 0 10px"><a href=""><span class="titColor">魅力中职</span></a></div>
              <div class="gd wz_rigdq xsgb"><a href=""><span class="mag_r-5 wz_black">更多</span></a><span class="centerdq"><img style="margin-right: 10px" src="../../assets/img/mores.png" height="15" width="15"/></span></div>
            </div>
            <div class="split_3">
              <div>
                <div class=" jz img_100">
                  <div v-for="(item,index) in meilizhongzhiList" :key="index+ '-' + Math.random()" v-if="meilizhongzhiList && item.flag=='recommend' && index<1" >
                    <a  @click="addList(item,[
                  {tit:'首页',path:'homeList'},
                  {tit:'新闻中心',path:'xinwenzhongxin'},
                  {tit:'聚焦',path:'jujiao'}
                ])"><img :src="$store.state.imageUrltitle+item.image"/></a>
                  </div>
                  <div class="">
                    <ul class="fz_14 ul" v-for="(item,index) in meilizhongzhiList" :key="index+ '-' + Math.random()" v-if="item.flag=='' && index<6">
                      <li style="list-style-type: square;">
                        <div class="pad_5_0">
                          <div class="ccsl_1">
                            <a @click="addList(item,[
                  {tit:'首页',path:'homeList'},
                  {tit:'新闻中心',path:'xinwenzhongxin'},
                  {tit:'聚焦',path:'jujiao'}
                ])"><span class="aColor">{{item.title}}</span></a>
                          </div>

                        </div>
                      </li>
                    </ul>
                  </div>
                </div>
              </div>
              <div class="topdq">
                <div class="wh_9 jz">
                  <div class="split_3">
                    <div>
                      <span :class="istab==1?'tab_tb':''" @mousemove="tab(1)">中职学校</span></div>
                    <div>
                      <span :class="istab==2?'tab_tb':''" @mousemove="tab(2)">招生简章</span></div>
                    <div>
                      <span :class="istab==3?'tab_tb':''" @mousemove="tab(3)">热门专业</span></div>
                  </div>
                  <div style="min-height: 370px">
                    <div class="xd">
                      <div class="boxs" v-if="istab==1" style="padding-top: 10px;">
                        <div class="jd pad_5_0" style="top:10px;left: 0;background-color: white!important;z-index: 10;width: 100%">
                          <div class="wh_max" style="background-color: white"><a href=""><span class="aColor centerdq">广西工商学校</span><img class="centerdq" src="../../assets/img/big_v.png"/></a></div>
                        </div>
                        <div class="notice">
                          <div class="notice__inner">
                            <div class="notice__box">
                              <div class="notice__item"><a href=""><span class="aColor">XXXXX000职业技术1XXXXX000职业技术1XXXXXXXX000职业技术1XXXXX000职业技术1XXXXX000职业技术1XXXXX000职业技术1XX000职业技术1XXXXX000职业技术1</span></a></div>
                              <div class="notice__item"><a href=""><span class="aColor">XXXXXX职业技术学院2</span></a></div>
                              <div class="notice__item"><a href=""><span class="aColor">XXXXXX职业技术学院3</span></a></div>
                              <div class="notice__item"><a href=""><span class="aColor">XXXXXX职业技术学院4</span></a></div>
                              <div class="notice__item"><a href=""><span class="aColor">XXXXXX职业技术学院5</span></a></div>
                              <div class="notice__item"><a href=""><span class="aColor">XXXXXX职业技术学院6</span></a></div>
                              <div class="notice__item"><a href=""><span class="aColor">XXXXXX职业技术学院7</span></a></div>
                              <div class="notice__item"><a href=""><span class="aColor">XXXXXX职业技术学院8</span></a></div>
                              <div class="notice__item"><a href=""><span class="aColor">XXXXX111职业技术9</span></a></div>
                              <div class="notice__item"><a href=""><span class="aColor">XXXXX111职业技术9</span></a></div>
                            </div>
                            <div class="notice__box">
                              <div class="notice__item"><a href=""><span class="aColor">XXXXX000职业技术XXXXX000职业技术1XXXXX000职业技术1XXXXX000职业技术1XXXXX000职业技术11XXXXX000职业技术1XXXXX000职业技术1XXXXX000职业技术1</span></a></div>
                              <div class="notice__item"><a href=""><span class="aColor">XXXXXX职业技术学院2XXXXXX职业技术学院2XXXXXX职业技术学院2XXXXXX职业技术学院2XXXXXX职业技术学院2XXXXXX职业技术学院2XXXXXX职业技术学院2</span></a></div>
                              <div class="notice__item"><a href=""><span class="aColor">XXXXXX职业技术学院3</span></a></div>
                              <div class="notice__item"><a href=""><span class="aColor">XXXXXX职业技术学院4</span></a></div>
                              <div class="notice__item"><a href=""><span class="aColor">XXXXXX职业技术学院5</span></a></div>
                              <div class="notice__item"><a href=""><span class="aColor">XXXXXX职业技术学院6</span></a></div>
                              <div class="notice__item"><a href=""><span class="aColor">XXXXXX职业技术学院7</span></a></div>
                              <div class="notice__item"><a href=""><span class="aColor">XXXXXX职业技术学院8</span></a></div>
                              <div class="notice__item"><a href=""><span class="aColor">XXXXX111职业技术9</span></a></div>
                              <div class="notice__item"><a href=""><span class="aColor">XXXXX111职业技术9</span></a></div>
                            </div>
                          </div>
                        </div>

                      </div>
                      <div class="boxs" v-if="istab==2" style="padding-top: 10px;">
                        <div class="pad_5_0" v-for="(item,index) in recruitStu" :key="index+ '-' + Math.random()">
                          <div @mousemove="cdd(index)" @mouseout="cdd(999)">
                            <div class="ccsl_1">
                              <a href=""><span class="aColor " :class="aHover==index+1?'sppad_l':'gd_05'">{{item.tit}}</span></a>
                            </div>
                          </div>
                        </div>
                      </div>
                      <div class="boxs" v-if="istab==3" style="padding-top: 10px;">
                        <div class="pad_5_0" v-for="(item,index) in hot" :key="index+ '-' + Math.random()">
                          <div @mousemove="cdd(index)" @mouseout="cdd(999)">
                            <div class="ccsl_1"><a href=""><span class="aColor"  :class="aHover==index+1?'sppad_l':'gd_05'">{{item.tit}}</span></a></div>
                          </div>
                        </div>
                      </div>
                    </div>
                  </div>
                </div>

              </div>
              <div class="topdq">
                <div><span class="em wz_blue" style="border-left: 10px solid #0069df;padding:5px 0 5px 10px">中职工具</span></div>
                <div class="wz_jz">
                  <span><i class="iconfont icon-xuexiao_xuexiaoxinxi"></i> 查学校</span>
                  <span style="margin-left: 30px"><i class="iconfont icon-gengduo"></i> 查专业</span>
                </div>
                <div class="wz_jz xd pad_15_0">
                  <img class="" src="../../assets/img/icon11.png" height="9" width="104"/>
                  <span class="jd wz_black jdjz fz_20 em" style="">院校</span>
                </div>
                <div class="jz">
                  <div class="wh_6 jz">
                    <ul class="ul_r">
                      <li class="pad_4_0" style="width: 50%" v-for="(item,index) in zhongzhiyuanxiaoList" :key="index+ '-' + Math.random()">
                        <div class="ccsl_1 hh xsgb"><span class="aColor">{{item.title}}</span></div>
                      </li>
                    </ul>
                    <div class="flex_r">
                      <div class="aColor disp mag_l-10" style="width: 50%;">更多...</div>
                    </div>
                  </div>
                </div>
                <div class="wz_jz xd pad_15_0">
                  <img class="" src="../../assets/img/icon11.png" height="9" width="104"/>
                  <span class="jd wz_black jdjz fz_20 em" style="">专业</span>
                </div>
                <div class="wh_6 jz">
                  <ul class="ul_r">
                    <li class="pad_4_0" style="width: 50%" v-for="(item,index) in zhongzhizhuanyeList" :key="index+ '-' + Math.random()">
                      <div class="ccsl_1 hh xsgb"><span class="aColor">{{item.title}}</span></div>
                    </li>
                  </ul>
                  <div class="flex_r">
                    <div class="aColor disp mag_l-10" style="width: 50%;">更多...</div>
                  </div>
                </div>
              </div>
            </div>
          </div>
            <CarouselList></CarouselList>
        </div>
<!--        魅力高职-->
        <div  class="mag_tb_20 bor_10 xyy pad_b_20">
          <div class="boxs" style="padding: 0 20px">
            <div class="ddisp">
              <div class="fz_22 pad_10_0 boxs" style="padding: 10px 0 10px"><a href=""><span class="titColor">魅力高职</span></a></div>
              <div class="gd wz_rigdq xsgb"><a href=""><span class="mag_r-5 wz_black">更多</span></a><span class="centerdq"><img style="margin-right: 10px" src="../../assets/img/mores.png" height="15" width="15"/></span></div>
            </div>
            <div class="split_3">
              <div>
                <div class="z img_100" >
                  <div v-for="(item,index) in meiligaozhiList" :key="index+ '-' + Math.random()" v-if="item.flag=='recommend'">
                    <a href=""><img :src="$store.state.imageUrltitle+item.image"/></a>
                  </div>
                  <div class="">
                    <ul class="fz_14 ul" v-for="(item,index) in meiligaozhiList" :key="index+ '-' + Math.random()" v-if="item.flag==''">
                      <li style="list-style-type: square;">
                        <div class="pad_5_0">
                          <div class="ccsl_1">
                            <a @click="addList(item,[
                  {tit:'首页',path:'homeList'},
                  {tit:'新闻中心',path:'xinwenzhongxin'},
                  {tit:'聚焦',path:'jujiao'}
                ])"><span class="aColor">{{item.title}}</span></a>
                          </div>
                        </div>
                      </li>
                    </ul>
                  </div>
                </div>
              </div>
              <div class="topdq">
                <div class="wh_9 jz">
                  <div class="split_3">
                    <div>
                      <span :class="istabGz==1?'tab_tb':''" @mousemove="ddd(1)">高职学校</span></div>
                    <div>
                      <span :class="istabGz==2?'tab_tb':''" @mousemove="ddd(2)">招生简章</span></div>
                    <div>
                      <span :class="istabGz==3?'tab_tb':''" @mousemove="ddd(3)">热门专业</span></div>
                  </div>
                  <div style="height: 350px">
                    <div class="xd">
                      <div class="boxs" v-if="istabGz==1" style="padding-top: 10px;">
                        <div class="jd pad_5_0" style="top:10px;left: 0;background-color: white!important;z-index: 10;width: 100%">

                          <div class="wh_max" style="background-color: white">
                            <a href=""><span class="aColor centerdq">广西工商学校</span><img class="centerdq" src="../../assets/img/big_v.png"/></a>
                          </div>
                          <div class="wh_max" style="background-color: white">
                            <a href=""><span class="aColor centerdq">广西水利电力职业技术学院</span><img class="centerdq" src="../../assets/img/big_v.png"/></a>
                          </div>
                          <div class="wh_max" style="background-color: white">
                            <a href=""><span class="aColor centerdq">广西金融职业技术学院</span><img class="centerdq" src="../../assets/img/big_v.png"/></a>
                          </div>
                          <div class="wh_max" style="background-color: white">
                            <a href=""><span class="aColor centerdq">南宁职业技术学院</span><img class="centerdq" src="../../assets/img/big_v.png"/></a>
                          </div>
                        </div>
                        <div class="notice">
                          <div class="notice__inner">
                            <div class="notice__box">
                              <div class="notice__item"><a href=""><span class="aColor">XXXXX000职业技术1XXXXX000职业技术1XXXXXXXX000职业技术1XXXXX000职业技术1XXXXX000职业技术1XXXXX000职业技术1XX000职业技术1XXXXX000职业技术1</span></a></div>
                              <div class="notice__item"><a href=""><span class="aColor">XXXXXX职业技术学院2</span></a></div>
                              <div class="notice__item"><a href=""><span class="aColor">XXXXXX职业技术学院3</span></a></div>
                              <div class="notice__item"><a href=""><span class="aColor">XXXXXX职业技术学院4</span></a></div>
                              <div class="notice__item"><a href=""><span class="aColor">XXXXXX职业技术学院5</span></a></div>
                              <div class="notice__item"><a href=""><span class="aColor">XXXXXX职业技术学院6</span></a></div>
                              <div class="notice__item"><a href=""><span class="aColor">XXXXXX职业技术学院7</span></a></div>
                              <div class="notice__item"><a href=""><span class="aColor">XXXXXX职业技术学院8</span></a></div>
                              <div class="notice__item"><a href=""><span class="aColor">XXXXX111职业技术9</span></a></div>
                              <div class="notice__item"><a href=""><span class="aColor">XXXXX111职业技术9</span></a></div>
                            </div>
                            <div class="notice__box">
                              <div class="notice__item"><a href=""><span class="aColor">XXXXX000职业技术XXXXX000职业技术1XXXXX000职业技术1XXXXX000职业技术1XXXXX000职业技术11XXXXX000职业技术1XXXXX000职业技术1XXXXX000职业技术1</span></a></div>
                              <div class="notice__item"><a href=""><span class="aColor">XXXXXX职业技术学院2XXXXXX职业技术学院2XXXXXX职业技术学院2XXXXXX职业技术学院2XXXXXX职业技术学院2XXXXXX职业技术学院2XXXXXX职业技术学院2</span></a></div>
                              <div class="notice__item"><a href=""><span class="aColor">XXXXXX职业技术学院3</span></a></div>
                              <div class="notice__item"><a href=""><span class="aColor">XXXXXX职业技术学院4</span></a></div>
                              <div class="notice__item"><a href=""><span class="aColor">XXXXXX职业技术学院5</span></a></div>
                              <div class="notice__item"><a href=""><span class="aColor">XXXXXX职业技术学院6</span></a></div>
                              <div class="notice__item"><a href=""><span class="aColor">XXXXXX职业技术学院7</span></a></div>
                              <div class="notice__item"><a href=""><span class="aColor">XXXXXX职业技术学院8</span></a></div>
                              <div class="notice__item"><a href=""><span class="aColor">XXXXX111职业技术9</span></a></div>
                              <div class="notice__item"><a href=""><span class="aColor">XXXXX111职业技术9</span></a></div>
                            </div>
                          </div>
                        </div>
                      </div>
                      <div class="boxs" v-if="istabGz==2" style="padding-top: 10px;">
                        <div class="pad_5_0" v-for="(item,index) in recruitStu" :key="index+ '-' + Math.random()">
                          <div @mousemove="gdd(index)" @mouseout="gdd(999)">
                            <div class="ccsl_1"><a href=""><span class="aColor " :class="aGzHover==index+1?'sppad_l':'gd_05'">{{item.tit}}</span></a></div>

                          </div>
                        </div>
                      </div>
                      <div class="boxs" v-if="istabGz==3" style="padding-top: 10px;">
                        <div class="pad_5_0" v-for="(item,index) in hot" :key="index+ '-' + Math.random()">
                          <div @mousemove="gdd(index)" @mouseout="gdd(999)">
                            <div class="ccsl_1"><a href=""><span class="aColor" :class="aGzHover==index+1?'sppad_l':'gd_05'">{{item.tit}}</span></a></div>
                          </div>
                        </div>
                      </div>
                    </div>
                  </div>
                </div>

              </div>
              <div class="topdq">
                <div><span class="em wz_blue" style="border-left: 10px solid #0069df;padding:5px 0 5px 10px">高职工具</span></div>
                <div class="wz_jz">
                  <span><i class="iconfont icon-xuexiao_xuexiaoxinxi"></i> 查学校</span>
                  <span style="margin-left: 30px"><i class="iconfont icon-gengduo"></i> 查专业</span>
                </div>
                <div class="wz_jz xd pad_15_0">
                  <img class="" src="../../assets/img/icon11.png" height="9" width="104"/>
                  <span class="jd wz_black jdjz fz_20 em" style="">院校</span>
                </div>
                <div class="jz">
                  <div class="wh_6 jz">
                    <ul class="ul_r">
                      <li class="pad_4_0" style="width: 50%" v-for="(item,index) in gaozhiyuanxiaoList" :key="index+ '-' + Math.random()">
                        <div class="ccsl_1 hh xsgb"><span class="aColor">{{item.title}}</span></div>
                      </li>
                    </ul>
                    <div class="flex_r">
                      <div class="aColor disp mag_l-10" style="width: 50%;">更多...</div>
                    </div>
                  </div>
                </div>
                <div class="wz_jz xd pad_15_0">
                  <img class="" src="../../assets/img/icon11.png" height="9" width="104"/>
                  <span class="jd wz_black jdjz fz_20 em" style="">专业</span>
                </div>
                <div class="wh_6 jz">
                  <ul class="ul hh">
                    <li class="pad_4_0" style="width: 50%" v-for="(item,index) in gaozhizhuanyeList" :key="index+ '-' + Math.random()">
                      <div class="ccsl_1 hh xsgb"><span class="aColor">{{item.title}}</span></div>
                    </li>
                  </ul>
                  <div class="flex_r">
                    <div class="aColor disp mag_l-10" style="width: 50%;">更多...</div>
                  </div>
                </div>
              </div>
            </div>
          </div>
           <CarouselListtoo></CarouselListtoo>
        </div>
<!--        图片baner-->
        <div class="img_100 mag_tb_20">
          <a href=""><img class="" src="../../assets/img/gj.png" alt=""></a>
        </div>
<!--        考证-->
        <div class="mag_tb_20 bor_10 xyy" style="min-height: 300px;padding: 10px 0 20px ">
          <div class="pad_0_20 boxs split_3_7 ">
            <div class="topdq">
              <div class="ddisp wh_f">
                <div class="fz_22 pad_10_0"><a href=""><span class="titColor">考证</span></a></div>
                <div class="flex_1 fz_14">
                  <div class="wh_f flex_r wz_rigdq">
                    <div class="flex_1"><span class="aColor">考试中心简介</span></div>
                    <div class="flex_1"><span class="mag_l-10 aColor">服务内容</span></div>
                    <div class="flex_1" >
                      <a href=""><span class="mag_r-5 aColor">更多</span></a><span class="centerdq"><img style="margin-right: 10px" src="../../assets/img/mores.png" height="15" width="15"/></span>
                    </div>
                  </div>



                </div>
              </div>
              <div>
                <div>
                  <div  class="pad_5_0" v-for="(item,index) in kaozhengList" :key="index+ '-' + Math.random()" v-if="kaozhengList">
                    <div class="ccsl_1"><a @click="addList(item,[
                  {tit:'首页',path:'homeList'},
                  {tit:'新闻中心',path:'xinwenzhongxin'},
                  {tit:'聚焦',path:'jujiao'}
                ])"><span class="aColor">{{ item.title }}</span></a></div>
                    </div>
                </div>
              </div>
            </div>
            <div class="topdq">
              <van-swipe class="" :autoplay="150000" indicator-color="white">
                <van-swipe-item>
                  <div class="split_4_6">
                    <div class="topdq">
                      <div class=" wh_9 jz">
                        <div class="wz_blue bor_b_qblue pad_10_0 boxs em">
                          <div>电子行业职业技术鉴定</div>
                        </div>
                        <div class="pds">
                          <ul class="ul_r">
                            <li class="pad_5_0"  v-for="(item,index) in zhengshu1List" :key="index" v-if="zhengshu1List">
                              <div @click="addList(item,[
                  {tit:'首页',path:'homeList'},
                  {tit:'新闻中心',path:'xinwenzhongxin'},
                  {tit:'中职动态',path:'jujiao'}
                ])" class="ccsl_1 hh"><span class="aColor">{{ item.title }}</span></div>
                            </li>
                          </ul>
                        </div>
                      </div>
                    </div>
                    <div class="topdq">
                      <div class=" wh_9 jz">
                        <div class="wz_blue bor_b_qblue pad_10_0 boxs em">
                          <div>全国计算机信息高新技术</div>
                        </div>
                        <div class="">
                          <ul class="ul_r">
                            <li class="pad_5_0" style="width: 33%" v-for="(item,index) in zhengshu2List" :key="index" v-if="zhengshu2List">
                              <div @click="addList(item,[
                  {tit:'首页',path:'homeList'},
                  {tit:'新闻中心',path:'xinwenzhongxin'},
                  {tit:'中职动态',path:'jujiao'}
                ])" class="ccsl_1 hh"><span class="aColor">{{ item.title }}</span></div>
                            </li>
                          </ul>
                        </div>
                      </div>
                    </div>
                  </div>
                </van-swipe-item>
                <van-swipe-item>
                  <div class="split_55_45">
                    <div class="topdq">
                      <div class=" wh_9 jz">
                        <div class="wz_blue bor_b_qblue pad_10_0 boxs em">
                          <div>全国工业和信息化应用人才评测证书</div>
                        </div>
                        <div>
                          <ul class="ul_r">
                            <li class="pad_5_0" style="width: 50%" v-for="(item,index) in zhengshu3List" :key="index" v-if="zhengshu3List">
                              <div @click="addList(item,[
                  {tit:'首页',path:'homeList'},
                  {tit:'新闻中心',path:'xinwenzhongxin'},
                  {tit:'中职动态',path:'jujiao'}
                ])" class="ccsl_1 hh"><span class="aColor">{{ item.title }}</span></div>
                            </li>
                          </ul>
                        </div>

                      </div>
                    </div>
                    <div class="topdq">
                      <div class=" wh_9 jz">
                        <div class="wz_blue bor_b_qblue pad_10_0 boxs em">
                          <div>工业信息化系统专业技能证书</div>
                        </div>
                        <div>
                          <div class="pds topdq">
                            <ul class="ul_r">
                              <li class="pad_5_0" style="" v-for="(item,index) in zhengshu4List" :key="index" v-if="zhengshu4List">
                                <div @click="addList(item,[
                  {tit:'首页',path:'homeList'},
                  {tit:'新闻中心',path:'xinwenzhongxin'},
                  {tit:'中职动态',path:'jujiao'}
                ])" class="ccsl_1 hh"><span class="aColor">{{ item.title }}</span></div>
                              </li>
                            </ul>
                          </div>
                        </div>
                      </div>
                    </div>
                  </div>
                </van-swipe-item>
                <van-swipe-item>
                  <div class="split_55_45">
                    <div class="topdq">
                      <div class=" wh_9 jz">
                        <div class="wz_blue bor_b_qblue pad_10_0 boxs em">
                          <div>机械行业职业技能鉴定</div>
                        </div>
                        <div>
                          <div class="pds topdq">
                            <ul class="ul_r">
                              <li class="pad_5_0" style="" v-for="(item,index) in zhengshu5List" :key="index" v-if="zhengshu5List">
                                <div @click="addList(item,[
                  {tit:'首页',path:'homeList'},
                  {tit:'新闻中心',path:'xinwenzhongxin'},
                  {tit:'中职动态',path:'jujiao'}
                ])" class="ccsl_1 hh"><span class="aColor">{{ item.title }}</span></div>
                              </li>
                            </ul>
                          </div>
                        </div>

                      </div>
                    </div>
                    <div class="topdq">
                      <div class=" wh_9 jz">
                        <div class="wz_blue bor_b_qblue pad_10_0 boxs em">
                          <div>CEA国家信息化计算机教育认证项目</div>
                        </div>
                        <div>
                          <ul class="ul_r">
                            <li class="pad_5_0" style="width: 50%" v-for="(item,index) in zhengshu6List" :key="index" v-if="zhengshu6List">
                              <div @click="addList(item,[
                  {tit:'首页',path:'homeList'},
                  {tit:'新闻中心',path:'xinwenzhongxin'},
                  {tit:'中职动态',path:'jujiao'}
                ])" class="ccsl_1 hh"><span class="aColor">{{ item.title }}</span></div>
                            </li>
                          </ul>
                        </div>
                      </div>
                    </div>
                  </div>
                </van-swipe-item>
              </van-swipe>
            </div>
          </div>

        </div>
<!--        这是校企合作-->
        <div class="mag_tb_20 bor_10 pad_10_0 xyy split_3_7">
          <div class="topdq">
            <div class="wh_9 jz">
              <div class="xyy xd btn-3" @mousemove="istabHover(1)" @mouseout="istabHover(999)">
                <a><i class="mag_r-20" :class="istabHover3==1?'icon-bm1':'icon-bm'"></i>中职学校网上报名系统</a>
              </div>
              <div class="xyy xd btn-3" @mousemove="istabHover(2)" @mouseout="istabHover(999)">
                <a><i :class="istabHover3==2?'icon-gj1':'icon-gj'"></i>会员学校发稿统计查询</a>
              </div>
              <div class="xyy xd btn-3" @mousemove="istabHover(3)" @mouseout="istabHover(999)">
                <a><i :class="istabHover3==3?'icon-nj1':'icon-nj'"></i>广西职业院校年鉴查询</a>
              </div>
            </div>
            <div class="hh wz_jz xsgb fz_14 ddd">
              <div class="split-2 mag_t-20 pad_10_0 wz_jz">
                <div  @click="wailian('http://www.ep12.com/a/hot/zhixiaozhengaiweb/zlnb/')" class="wh_9 jz xyy" @mousemove="isHover(1)"  @mouseout="isHover(999)">
                  <div class="spjz_flex pad_10_0"><i :class="isHover4==1?'zzbg-icon1':'zzbg-icon'"></i></div>
                  <div class="pad_10_0">中职教育质量年度报告</div>
                </div>
              </div>
              <div class="split-2 mag_t-20 pad_10_0 wz_jz">
                <div  @click="wailian('http://www.ep12.com/a/hot/zhixiaozhengaiweb/zlnb/')" class="wh_9 jz xyy"  @mousemove="isHover(2)"  @mouseout="isHover(999)">
                  <div class="spjz_flex pad_10_0"><i class="gzbg-icon" :class="isHover4==2?'gzbg-icon1':'gzbg-icon'"></i></div>
                  <div class="pad_10_0">中职教育质量年度报告</div>
                </div>
              </div>
              <div class="split-2 mag_t-20 pad_10_0 wz_jz">
                <div  @click="wailian('http://www.ep12.com/a/zhongdasaishi/jinendasai1/')" class="wh_9 jz xyy"  @mousemove="isHover(3)" @mouseout="isHover(999)">
                  <div class="spjz_flex pad_10_0"><i class="jnds-icon" :class="isHover4==3?'jnds-icon1':'jnds-icon'"></i></div>
                  <div class="pad_10_0">中职教育质量年度报告</div>
                </div>
              </div>
              <div class="split-2 mag_t-20 pad_10_0 wz_jz">
                <div  @click="wailian('http://www.ep12.com/a/zhengshu/')" class="wh_9 jz xyy"  @mousemove="isHover(4)"  @mouseout="isHover(999)">
                  <div class="spjz_flex pad_10_0"><i class="wmfc-icon" :class="isHover4==4?'wmfc-icon1':'wmfc-icon'"></i></div>
                  <div class="pad_10_0">中职教育质量年度报告</div>
                </div>
              </div>
            </div>
            <div class="wz_jz xd pad_15_0">
              <img class="" src="../../assets/img/jgjj_bg.png" height="9"/>
              <span class="jd wz_black jdjz fz_20 em" style="">融媒体矩阵</span>
            </div>
            <div class="hh">
              <div class="split3 img_100 fz_14 wz_jz mag_t-10 topdq" v-for="(item,index) in rongmeitiList" :key="index" v-if="rongmeitiList && index<7">
                <div class="wh_8 jz">
                  <div><img :src="$store.state.imageUrltitle+item.image" alt=""></div>
                  <div>{{ item.title }}</div>
                </div>
              </div>
            </div>
          </div>
          <div class="topdq split2">
            <div class="topdq xsgb mag_t-10">
              <div class="ddisp wh_9-5 jz wh_f">
                <div class="fz_22 pad_10_0 boxs"><a><span class="titColor">校企合作</span></a></div>
                <div class="gd wz_rigdq xsgb flex_1"><a><span class="mag_r-5 wz_black">更多</span></a><span class="centerdq">
                  <img style="margin-right: 10px" src="../../assets/img/mores.png" height="15" width="15"/></span>
                </div>
              </div>
              <div class="wh_9-5 jz">
                <div @click="addList(item,[
                  {tit:'首页',path:'homeList'},
                  {tit:'校企合作',path:'middleList',id:'379'}
                ])" class="img_100" v-for="(item,index) in xiaoqihezuoList" :key="index+ '-' + Math.random()" v-if="xiaoqihezuoList && item.flag=='recommend'">
                  <div><img  :src="$store.state.imageUrltitle+item.image" height="190" alt=""></div>
                  <div  class="wz_jz" style="padding: 10px 0;">
                    <div class="ccsl_1">
                      <a><span style="color: #0263c4;">
                    {{ item.title }}
                  </span></a>
                    </div>
                  </div>
                </div>
                <div>
                  <div @click="addList(item,[
                  {tit:'首页',path:'homeList'},
                  {tit:'新闻中心',path:'middleList'},
                  {tit:'动态',path:'middleList',id:'379'}
                  ])" class="pad_10_0 hh fz_14" v-for="(item,index) in xiaoqihezuoList" :key="index+ '-' + Math.random()" v-if="xiaoqihezuoList && item.flag==''">
                    <div class="ccsl_1"><a><span class="aColor">{{item.title}}</span></a></div>
                  </div>
                </div>
              </div>
            </div>
            <div class="topdq xsgb mag_t-10">
              <div class="ddisp wh_f wh_9-5 jz">
                <div class="fz_22 pad_10_0 boxs"><a><span class="titColor">现代课堂</span></a></div>
                <div class="gd flex_1 wz_rigdq xsgb"><a><span class="mag_r-5 wz_black">更多</span></a><span class="centerdq"><img style="margin-right: 10px" src="../../assets/img/mores.png" height="15" width="15"/></span></div>
              </div>
              <div class="wh_9-5 jz">
                <div @click="addList(item,[
                  {tit:'首页',path:'homeList'},
                  {tit:'教研教改',path:'teachingReform'},
                  {tit:'现代课堂',path:'middleList',id:'380'}
                ])" class="img_100" v-for="(item,index) in xiandaiketangList" v-if="xiandaiketangList && item.flag=='recommend'">
                  <div><img  :src="$store.state.imageUrltitle+item.image" height="190" alt=""></div>
                  <div  class="wz_jz" style="margin: 10px 0;">
                    <div class="ccsl_1">
                      <a><span style="color: #0263c4;">{{ item.title }}</span></a>
                    </div>
                  </div>
                </div>
                <div>
                  <div @click="addList(item,[
                  {tit:'首页',path:'homeList'},
                  {tit:'教研教改',path:'teachingReform'},
                  {tit:'现代课堂',path:'middleList',id:'380'}
                ])" class=" pad_5_0 hh fz_14" v-for="(item,index) in xiandaiketangList" :key="index+ '-' + Math.random()" v-if="xiandaiketangList && item.flag==''">
                    <div class="ccsl_1"><a><span class="aColor">{{item.title}}</span></a></div>
                  </div>
                </div>
              </div>
            </div>
            <div class="topdq xsgb mag_t-10">
              <div class="ddisp wh_9-5 jz wh_f">
                <div class="fz_22 pad_10_0 boxs"><a><span class="titColor">课题研究</span></a></div>
                <div class="gd flex_1 wz_rigdq xsgb"><a><span class="mag_r-5 wz_black">更多</span></a><span class="centerdq"><img style="margin-right: 10px" src="../../assets/img/mores.png" height="15" width="15"/></span></div>
              </div>
              <div class="wh_9-5 jz">
                <div @click="addList(item,[
                  {tit:'首页',path:'homeList'},
                  {tit:'教研教改',path:'teachingReform'},
                  {tit:'课题研究',path:'middleList',id:'381'}
                ])" class="img_100" v-for="(item,index) in ketiyanjiuList" :key="index+ '-' + Math.random()" v-if="ketiyanjiuList && item.flag=='recommend'">
                  <div><img  :src="$store.state.imageUrltitle+item.image" height="190" alt=""></div>
                  <div class="wz_jz" style="padding: 10px 0;">
                    <div class="ccsl_1"><a><span style="color: #0263c4;">{{ item.title }}</span></a></div>
                  </div>
                </div>
                <div>
                  <div @click="addList(item,[
                  {tit:'首页',path:'homeList'},
                  {tit:'教研教改',path:'teachingReform'},
                  {tit:'课题研究',path:'middleList',id:'381'}
                ])" v-for="(item,index) in ketiyanjiuList" :key="index+ '-' + Math.random()" v-if="ketiyanjiuList && item.flag==''">
                    <div class="pad_5_0 fz_14">
                      <div class="ccsl_1"><a><span class="aColor">{{item.title}}</span></a></div>
                    </div>

                  </div>
                </div>
              </div>
            </div>
            <div class="topdq xsgb mag_t-10">
              <div class="ddisp wh_f wh_9-5 jz">
                <div class="fz_22 pad_10_0 boxs"><a><span class="titColor">教师发展</span></a></div>
                <div class="gd flex_1 wz_rigdq xsgb"><a><span class="mag_r-5 wz_black">更多</span></a><span class="centerdq"><img style="margin-right: 10px" src="../../assets/img/mores.png" height="15" width="15"/></span></div>
              </div>
              <div class="wh_9-5 jz">
                <div @click="addList(item,[
                  {tit:'首页',path:'homeList'},
                  {tit:'教研教改',path:'teachingReform'},
                  {tit:'教师发展',path:'middleList',id:'382'}
                ])" class="img_100" v-for="(item,index) in jiaoshifazhanList" :key="index+ '-' + Math.random()" v-if="jiaoshifazhanList && item.flag=='recommend'">
                  <div><img  :src="$store.state.imageUrltitle+item.image" height="190" alt=""></div>
                  <div class="wz_jz" style="padding: 10px 0;">
                    <div class="ccsl_1"><a><span style="color: #0263c4;">{{ item.title }}</span></a></div>
                  </div>
                </div>
                <div>
                  <div @click="addList(item,[
                  {tit:'首页',path:'homeList'},
                  {tit:'教研教改',path:'teachingReform'},
                  {tit:'教师发展',path:'middleList',id:'382'}
                ])" class="pad_5_0 hh fz_14" v-for="(item,index) in jiaoshifazhanList" :key="index+ '-' + Math.random()" v-if="jiaoshifazhanList && item.flag==''">
                    <div class="ccsl_1"><a><span class="aColor">{{item.title}}</span></a></div>
                  </div>
                </div>
              </div>
            </div>
            </div>
        </div>
<!--        底部图片-->
        <div class="pad_5_0">
          <ul class="ul hh dbli">
            <li v-for="(item,index) in hezuoyuanxiaoList" :key="index" v-if="hezuoyuanxiaoList">
              <a><img :src="$store.state.imageUrltitle+item.image" height="31" width="88"/></a>
            </li>
          </ul>
        </div>
      </div>
    </div>
    <!--    侧边栏-->
    <div class="xyy ba_white pm xf wz_jz fz_14 xsgb xd" style="width: 100px;height: 300px;top: 33%;right: 0;color: #67707a">

      <div @mousemove="add(1)" @mouseout="edd()">
        <div>
          <svg style="color: #0a980a" xmlns="//www.w3.org/2000/svg" width="26" height="26" fill="currentColor" class="bi bi-wechat" viewBox="0 0 16 16">
            <path d="M11.176 14.429c-2.665 0-4.826-1.8-4.826-4.018 0-2.22 2.159-4.02 4.824-4.02S16 8.191 16 10.411c0 1.21-.65 2.301-1.666 3.036a.324.324 0 0 0-.12.366l.218.81a.616.616 0 0 1 .029.117.166.166 0 0 1-.162.162.177.177 0 0 1-.092-.03l-1.057-.61a.519.519 0 0 0-.256-.074.509.509 0 0 0-.142.021 5.668 5.668 0 0 1-1.576.22ZM9.064 9.542a.647.647 0 1 0 .557-1 .645.645 0 0 0-.646.647.615.615 0 0 0 .09.353Zm3.232.001a.646.646 0 1 0 .546-1 .645.645 0 0 0-.644.644.627.627 0 0 0 .098.356Z"></path>
            <path d="M0 6.826c0 1.455.781 2.765 2.001 3.656a.385.385 0 0 1 .143.439l-.161.6-.1.373a.499.499 0 0 0-.032.14.192.192 0 0 0 .193.193c.039 0 .077-.01.111-.029l1.268-.733a.622.622 0 0 1 .308-.088c.058 0 .116.009.171.025a6.83 6.83 0 0 0 1.625.26 4.45 4.45 0 0 1-.177-1.251c0-2.936 2.785-5.02 5.824-5.02.05 0 .1 0 .15.002C10.587 3.429 8.392 2 5.796 2 2.596 2 0 4.16 0 6.826Zm4.632-1.555a.77.77 0 1 1-1.54 0 .77.77 0 0 1 1.54 0Zm3.875 0a.77.77 0 1 1-1.54 0 .77.77 0 0 1 1.54 0Z"></path>
          </svg>
          <div><span>微信公众号</span></div>
        </div>
      </div>
      <div @mousemove="add(2)" @mouseout="edd()">
        <div>
          <svg style="color: #1a2f90" xmlns="//www.w3.org/2000/svg" width="26" height="26" fill="currentColor" class="bi bi-phone" viewBox="0 0 16 16">
            <path d="M11 1a1 1 0 0 1 1 1v12a1 1 0 0 1-1 1H5a1 1 0 0 1-1-1V2a1 1 0 0 1 1-1h6zM5 0a2 2 0 0 0-2 2v12a2 2 0 0 0 2 2h6a2 2 0 0 0 2-2V2a2 2 0 0 0-2-2H5z"></path>
            <path d="M8 14a1 1 0 1 0 0-2 1 1 0 0 0 0 2z"></path>
          </svg>
          <div><span>手机职教网</span></div>
        </div>
      </div>
      <div>
        <div>
          <a href="https://weibo.com/ep12?is_hot=1"><i class="iconfont icon-weibo wz_red" style="font-size: 30px"></i>
            <div><span style="color: rgb(103, 112, 122);">新浪微博</span></div></a>

        </div>
      </div>
      <div @click="addTop">
        <div>
          <svg style="color: #67707a" xmlns="//www.w3.org/2000/svg" width="26" height="26" fill="currentColor" class="bi bi-capslock" viewBox="0 0 16 16">
            <path fill-rule="evenodd" d="M7.27 1.047a1 1 0 0 1 1.46 0l6.345 6.77c.6.638.146 1.683-.73 1.683H11.5v1a1 1 0 0 1-1 1h-5a1 1 0 0 1-1-1v-1H1.654C.78 9.5.326 8.455.924 7.816L7.27 1.047zM14.346 8.5 8 1.731 1.654 8.5H4.5a1 1 0 0 1 1 1v1h5v-1a1 1 0 0 1 1-1h2.846zm-9.846 5a1 1 0 0 1 1-1h5a1 1 0 0 1 1 1v1a1 1 0 0 1-1 1h-5a1 1 0 0 1-1-1v-1zm6 0h-5v1h5v-1z"></path>
          </svg>
          <div><span>回到顶部</span></div>
        </div>
      </div>

      <img class="jd" v-if="a==1" style="right:120%;top: 20%;" src="../../assets/img/wx.jpg" height="100" width="100"/>
      <img class="jd" v-if="a==2" style="right:120%;top: 20%;" src="../../assets/img/wx2.jpg" height="100" width="100"/>
    </div>

  </div>
</template>

<script>
import 'animate.css'
import {getaddHotApi, getArticle} from "@/api/api";
import moment from "moment/moment";
export default {
  name: "homeList",
  data(){
    return{
      addUrl:[
        {
        }
      ],
      // 首页轮播图
      lunbotuList:[],
      // 滚动资讯
      informationList:[],
      // 职教聚焦
      zhijiaojujiaoList:[],
      // 通知公告
      tongzhigonggaoList:[],
      // 培训信息
      peixunxinxiList:[],
      // 招聘信息
      zhaopinxinxiList:[],
      // 中职动态
      zhongzhidongtaiList:[],
      // 高职动态
      gaozhidongtaiList:[],
      // 职教榜样
      bangyangyuandingList:[],
      // 职教榜样
      bangyangxueshengList:[],
      // 图说
      tushuoList:[],
      // 专访策划
      zhuanfangcehuaList:[],
      // 政策导读
      zhengcedaoduList:[],
      // 热点专题
      redianzhuantiList:[],
      // 职教视点
      zhijiaoshidianList:[],
      // 魅力中职
      meilizhongzhiList:[],
      // 中职学校
      zhongzhixuexiaoList:[],
      // 招生简章
      zhaoshengjianzhangList:[],
      // 热门专业
      remenzhuanyeList:[],
      // 中职专业
      zhongzhizhuanyeList:[],
      // 中职院校
      zhongzhiyuanxiaoList:[],
      // 高职专业
      gaozhizhuanyeList:[],
      // 高职院校
      gaozhiyuanxiaoList:[],
      // 魅力中职轮播图
      meilizhongzhilunbotuList:[],
      // 魅力高职
      meiligaozhiList:[],
      // 高职学校
      gaozhixuexiaoList:[],
      // 高职招生简章
      gaozhizhaoshengjianzhangList:[],
      // 高职热门专业
      gaozhiremenzhuanyeList:[],
      // 高职轮播图
      gaozhilunbotuList:[],
      // 考证
      kaozhengList:[],
      // 证书1
      zhengshu1List:[],
      // 证书1
      zhengshu2List:[],
      // 证书1
      zhengshu3List:[],
      // 证书1
      zhengshu4List:[],
      // 证书1
      zhengshu5List:[],
      // 证书1
      zhengshu6List:[],
      // 校企合作
      xiaoqihezuoList:[],
      // 现代课堂
      xiandaiketangList:[],
      // 课题研究
      ketiyanjiuList:[],
      //
      jiaoshifazhanList:[],
      // 公告信息栏状态
      stateId:1,
      // 侧边栏二维码状态 1显示微信 2显示小程序
      a:0,
      videoid:0,
      // 切换中职学校 招生简章 热门专业的动态id
      istab:1,
      // 切换中职学校 招生简章 热门专业的动态id
      istabGz:1,
      // 招生简章
      recruitStu:[
        {
          tit:'广西城市建设学校招生简章'
        },
        {
          tit:'广西理工职业技术学校招生简章'
        },
        {
          tit:'柳州市第二职业技术学校招生简章'
        },
        {
          tit:'广西民族中等专业学校招生简章'
        },
        {
          tit:'广西轻工技师学院招生简章'
        },
        {
          tit:'南宁市卫生学校招生简章'
        },
        {
          tit:'广西机电工业学校招生简章'
        },
        {
          tit:'河池市卫生学校招生简章'
        },
        {
          tit:'南宁市第六职业技术学校招生简章'
        },
        {
          tit:'南宁市第一职业技术学校招生简章'
        },
      ],
      // 热门专业
      hot:[
        {
          tit:'工业机器人应用与维护'
        },
        {
          tit:'汽车运用与维修'
        },
        {
          tit:'计算机动漫与游戏制作'
        },
        {
          tit:'中餐烹饪与营养膳食'
        },
        {
          tit:'电子商务'
        },
        {
          tit:'学前教育'
        },
        {
          tit:'工业机器人应用与维护'
        },
        {
          tit:'汽车运用与维修'
        },
        {
          tit:'计算机动漫与游戏制作'
        },
        {
          tit:'中餐烹饪与营养膳食'
        },
      ],
      // 鼠标移入状态1
      aHover:0,
      // 鼠标移入状态2
      aGzHover:0,
      // 鼠标移入状态3
      istabHover3:0,
      // 鼠标移入状态4
      isHover4:0,
      // 融媒体矩阵
      rongmeitiList:[],
      // 底部小图标
      hezuoyuanxiaoList:[],
      testShow:false,
      testShow2:false,
      testShow3:false,
    }
  },
  created() {
     // 轮播图
     this.lunbotu(383)
     // 滚动资讯 公告栏
     this.gundongzixun(321)
     //职教聚焦
     this.zhijiaojujiao(364)
     //通知公告
     this.tongzhigonggao(365)
     // 培训信息
     this.peixunxinxi(366),
     // 招聘信息
     this.zhaopinxinxi(384),
     // 中职动态
     this.zhongzhidongtai(368),
     // 高职动态
     this.gaozhidongtai(369),
     // 职教榜样>榜样园丁
     this.bangyangyuanding(386)
     // 职教榜样>榜样学生
     this.bangyangxuesheng(387),
     // 图说
     this.tushuo(371),
     // 专访策划
     this.zhuanfangcehua(372),
     // 政策导读
     this.zhengcedaodu(373),
     // 热点专题
     this.redianzhuanti(374),
     // 职教视点
     this.zhijiaoshidian(375),
     // 魅力中职
     this.meilizhongzhi(376),
     // 中职学校
         // this.zhongzhixuexiao(385),
     // 招生简章
         // this.zhaoshengjianzhang(378),
     // 热门专业
         // this.remenzhuanye(379),
     // 中职专业
     this.zhongzhizhuanye(393),
     // 中职院校
     this.zhongzhiyuanxiao(392),
     // 高职专业
     this.gaozhizhuanye(394),
     // 高职院校
     this.gaozhiyuanxiao(395),
     // // 魅力中职轮播图
     // this.meilizhongzhilunbotu(),
     // // 魅力高职
     this.meiligaozhi(377),
     // 高职学校
         // this.gaozhixuexiao(),
     // 高职招生简章
         // this.gaozhizhaoshengjianzhang(),
     // 高职热门专业
         // this.gaozhiremenzhuanye(),
     // 高职轮播图
     //this.gaozhilunbotu(),
     // 考证
     this.kaozheng(378),
     // 证书1
     this.zhengshu1(396),
     // // 证书1
     this.zhengshu2(397),
     // // 证书1
     this.zhengshu3(398),
     // // 证书1
     this.zhengshu4(399),
     // // 证书1
     this.zhengshu5(400),
     // // 证书1
     this.zhengshu6(401),
     // 校企合作
     this.xiaoqihezuo(379),
     // 现代课堂
     this.xiandaiketang(380),
     // 课题研究
     this.ketiyanjiu(381),
     // 教师发展
     this.jiaoshifazhan(382)
     // 融媒体矩阵
     this.rongmeiti(402)
     // 合作院校图片
     this.hezuoyuanxiao(403)
  },
  methods:{
    lunbotu(e){
      let params = {
        cid:e
      };
      getArticle(params).then(res => {
        if (res.status==200) {
          this.$store.state.lunbotuList = res.data
        } else {
          console.log(res.msg)
        }
      });
    },
    gundongzixun(e){
      let params = {
        cid:e
      };
      getArticle(params).then(res => {
        if (res.status==200) {
          this.informationList=res.data
        } else {
          console.log(res.msg)
        }
      });
    },
    zhijiaojujiao(e){
      let params = {
        cid:e
      };
      getArticle(params).then(res => {
        if (res.status==200) {
          this.zhijiaojujiaoList=res.data
        } else {
          console.log(res.msg)
        }
      });
    },
    tongzhigonggao(e){
      let params = {
        cid:e
      };
      getArticle(params).then(res => {
        if (res.status==200) {
          this.tongzhigonggaoList=res.data
        } else {
          console.log(res.msg)
        }
      });
    },
    peixunxinxi(e){
      let params = {
        cid:e
      };
      getArticle(params).then(res => {
        if (res.status==200) {
          this.peixunxinxiList=res.data
        } else {
          console.log(res.msg)
        }
      });
    },
    // 招聘信息
    zhaopinxinxi(e){
      let params = {
        cid:e
      };
      getArticle(params).then(res => {
        if (res.status==200) {
          this.zhaopinxinxiList=res.data
        } else {
          console.log(res.msg)
        }
      });
    },
// 中职动态
    zhongzhidongtai(e){
      let params = {
        cid:e
      };
      getArticle(params).then(res => {
        if (res.status==200) {
          this.zhongzhidongtaiList=res.data
        } else {
          console.log(res.msg)
        }
      });
    },
// 高职动态
    gaozhidongtai(e){
      let params = {
        cid:e
      };
      getArticle(params).then(res => {
        if (res.status==200) {
          this.gaozhidongtaiList=res.data
        } else {
          console.log(res.msg)
        }
      });
    },
// 职教榜样>榜样园丁
    bangyangyuanding(e){
      let params = {
        cid:e
      };
      getArticle(params).then(res => {
        if (res.status==200) {
          this.bangyangyuandingList=res.data
        } else {
          console.log(res.msg)
        }
      });
    },
// 职教榜样>榜样学生
    bangyangxuesheng(e){
      let params = {
        cid:e
      };
      getArticle(params).then(res => {
        if (res.status==200) {
          this.bangyangxueshengList=res.data
        } else {
          console.log(res.msg)
        }
      });
    },
// 图说
    tushuo(e){
      let params = {
        cid:e
      };
      getArticle(params).then(res => {
        if (res.status==200) {
          this.tushuoList=res.data
        } else {
          console.log(res.msg)
        }
      });
    },
// 专访策划
    zhuanfangcehua(e){
      let params = {
        cid:e
      };
      getArticle(params).then(res => {
        if (res.status==200) {
          this.zhuanfangcehuaList=res.data
        } else {
          console.log(res.msg)
        }
      });
    },
// 政策导读
    zhengcedaodu(e){
      let params = {
        cid:e
      };
      getArticle(params).then(res => {
        if (res.status==200) {
          this.zhengcedaoduList=res.data
        } else {
          console.log(res.msg)
        }
      });
    },
// 热点专题
    redianzhuanti(e){
      let params = {
        cid:e
      };
      getArticle(params).then(res => {
        if (res.status==200) {
          this.redianzhuantiList=res.data
        } else {
          console.log(res.msg)
        }
      });
    },
// 职教视点
    zhijiaoshidian(e){
      let params = {
        cid:e
      };
      getArticle(params).then(res => {
        if (res.status==200) {
          this.zhijiaoshidianList=res.data
        } else {
          console.log(res.msg)
        }
      });
    },
// 魅力中职
    meilizhongzhi(e){
      let params = {
        cid:e
      };
      getArticle(params).then(res => {
        if (res.status==200) {
          this.meilizhongzhiList=res.data
        } else {
          console.log(res.msg)
        }
      });
    },
// 融媒体
    rongmeiti(e){
      let params = {
        cid:e
      };
      getArticle(params).then(res => {
        if (res.status==200) {
          this.rongmeitiList=res.data
        } else {
          console.log(res.msg)
        }
      });
    },
// 融媒体
    hezuoyuanxiao(e){
      let params = {
        cid:e
      };
      getArticle(params).then(res => {
        if (res.status==200) {
          this.hezuoyuanxiaoList=res.data
        } else {
          console.log(res.msg)
        }
      });
    },
// 中职学校
    zhongzhixuexiao(e){
      let params = {
        cid:e
      };
      getArticle(params).then(res => {
        if (res.status==200) {
          this.zhongzhixuexiaoList=res.data
        } else {
          console.log(res.msg)
        }
      });
    },
// 招生简章
    zhaoshengjianzhang(e){
      let params = {
        cid:e
      };
      getArticle(params).then(res => {
        if (res.status==200) {
          this.zhaoshengjianzhangList=res.data
        } else {
          console.log(res.msg)
        }
      });
    },
// 热门专业
    remenzhuanye(e){
      let params = {
        cid:e
      };
      getArticle(params).then(res => {
        if (res.status==200) {
          this.remenzhuanyeList=res.data
        } else {
          console.log(res.msg)
        }
      });
    },
// 中职专业
    zhongzhizhuanye(e){
      let params = {
        cid:e
      };
      getArticle(params).then(res => {
        if (res.status==200) {
          this.zhongzhizhuanyeList=res.data
        } else {
          console.log(res.msg)
        }
      });
    },
// 中职院校
    zhongzhiyuanxiao(e){
      let params = {
        cid:e
      };
      getArticle(params).then(res => {
        if (res.status==200) {
          this.zhongzhiyuanxiaoList=res.data
        } else {
          console.log(res.msg)
        }
      });
    },
// 高职专业
    gaozhizhuanye(e){
      let params = {
        cid:e
      };
      getArticle(params).then(res => {
        if (res.status==200) {
          this.gaozhizhuanyeList=res.data
        } else {
          console.log(res.msg)
        }
      });
    },
// 高职院校
    gaozhiyuanxiao(e){
      let params = {
        cid:e
      };
      getArticle(params).then(res => {
        if (res.status==200) {
          this.gaozhiyuanxiaoList=res.data
        } else {
          console.log(res.msg)
        }
      });
    },
// 魅力中职轮播图
    meilizhongzhilunbotu(e){
      let params = {
        cid:e
      };
      getArticle(params).then(res => {
        if (res.status==200) {
          this.meilizhongzhilunbotuList=res.data
        } else {
          console.log(res.msg)
        }
      });
    },
// 魅力高职
    meiligaozhi(e){
      let params = {
        cid:e
      };
      getArticle(params).then(res => {
        if (res.status==200) {
          this.meiligaozhiList=res.data
        } else {
          console.log(res.msg)
        }
      });
    },
// 高职学校
    gaozhixuexiao(e){
      let params = {
        cid:e
      };
      getArticle(params).then(res => {
        if (res.status==200) {
          this.gaozhixuexiaoList=res.data
        } else {
          console.log(res.msg)
        }
      });
    },
// 高职招生简章
    gaozhizhaoshengjianzhang(e){
      let params = {
        cid:e
      };
      getArticle(params).then(res => {
        if (res.status==200) {
          this.gaozhizhaoshengjianzhangList=res.data
        } else {
          console.log(res.msg)
        }
      });
    },
// 高职热门专业
    gaozhiremenzhuanye(e){
      let params = {
        cid:e
      };
      getArticle(params).then(res => {
        if (res.status==200) {
          this.gaozhiremenzhuanyeList=res.data
        } else {
          console.log(res.msg)
        }
      });
    },
// 高职轮播图
    gaozhilunbotu(e){
      let params = {
        cid:e
      };
      getArticle(params).then(res => {
        if (res.status==200) {
          this.gaozhilunbotuList=res.data
        } else {
          console.log(res.msg)
        }
      });
    },
// 考证
    kaozheng(e){
      let params = {
        cid:e
      };
      getArticle(params).then(res => {
        if (res.status==200) {
          this.kaozhengList=res.data
        } else {
          console.log(res.msg)
        }
      });
    },
// 证书1
    zhengshu1(e){
      let params = {
        cid:e
      };
      getArticle(params).then(res => {
        if (res.status==200) {
          this.zhengshu1List=res.data
        } else {
          console.log(res.msg)
        }
      });
    },
// 证书2
    zhengshu2(e){
      let params = {
        cid:e
      };
      getArticle(params).then(res => {
        if (res.status==200) {
          this.zhengshu2List=res.data
        } else {
          console.log(res.msg)
        }
      });
    },
    wailian(e){
      window.location.href = e
    },
// 证书3
    zhengshu3(e){
      let params = {
        cid:e
      };
      getArticle(params).then(res => {
        if (res.status==200) {
          this.zhengshu3List=res.data
        } else {
          console.log(res.msg)
        }
      });
    },
// 证书4
    zhengshu4(e){
      let params = {
        cid:e
      };
      getArticle(params).then(res => {
        if (res.status==200) {
          this.zhengshu4List=res.data
        } else {
          console.log(res.msg)
        }
      });
    },
// 证书5
    zhengshu5(e){
      let params = {
        cid:e
      };
      getArticle(params).then(res => {
        if (res.status==200) {
          this.zhengshu5List=res.data
        } else {
          console.log(res.msg)
        }
      });
    },
// 证书6
    zhengshu6(e){
      let params = {
        cid:e
      };
      getArticle(params).then(res => {
        if (res.status==200) {
          this.zhengshu6List=res.data
        } else {
          console.log(res.msg)
        }
      });
    },
// 校企合作
    xiaoqihezuo(e){
      let params = {
        cid:e
      };
      getArticle(params).then(res => {
        if (res.status==200) {
          this.xiaoqihezuoList=res.data
        } else {
          console.log(res.msg)
        }
      });
    },
// 现代课堂
    xiandaiketang(e){
      let params = {
        cid:e
      };
      getArticle(params).then(res => {
        if (res.status==200) {
          this.xiandaiketangList=res.data
        } else {
          console.log(res.msg)
        }
      });
    },
// 课题研究
    ketiyanjiu(e){
      let params = {
        cid:e
      };
      getArticle(params).then(res => {
        if (res.status==200) {
          this.ketiyanjiuList=res.data
        } else {
          console.log(res.msg)
        }
      });
    },
// 教师发展
    jiaoshifazhan(e){
      let params = {
        cid:e
      };
      getArticle(params).then(res => {
        if (res.status==200) {
          this.jiaoshifazhanList=res.data
        } else {
          console.log(res.msg)
        }
      });
    },










    addhot(e){
      let params = {
        aid:e
      };
      getaddHotApi(params).then(res => {
        if (res.status==200) {
        } else {
          console.log(res.msg)
        }
      });
    },
    // 传递选中子数据id 跳转到新页面
    addList(e,tit){
      let listid = e.id
      this.addhot(e.id)
      // 告诉新页面 我从哪里来的
      var titlist=JSON.stringify(tit);
      this.$router.push({
        path:'listIndex',
        query:{
          // 栏目id
          listid,
          // 传递的导航信息
          titlist
        }
      })
    },
    // 传递选标题下内容数据id 跳转到新页面
    bddList(e,tit){
      let listid = e
      // 告诉新页面 我从哪里来的
      window.localStorage.setItem('daohang',JSON.stringify(tit))

      var titlist=JSON.stringify(tit);
      this.$router.push({
        path:'middleList',
        query:{
          // 栏目id
          listid,
          // 传递的导航信息
          titlist
        }
      })
    },
    isHover(e){
      this.isHover4=e
    },
    istabHover(e){
      this.istabHover3=e
    },
    // 点击返回页面顶部加过度动画
    addTop(){
      //这一步是为了防止，点击事件的过度发生。
      var myTimer = -1;
      var scrollTo = document.documentElement.scrollTop || document.body.scrollTop
      if(myTimer = -1){
        myTimer = setInterval(() => {
          scrollTo -= 60
          if(scrollTo<=0){
            scrollTo = 0
            window.clearInterval(myTimer)
            myTimer = -1
          }
          window.scrollTo(0,scrollTo) //这是值  是指离开网页顶部的距离
        }, 10);//过度时间
        window.scrollTo(0,0) //这是值  是指离网页顶部0px
        // document.documentElement.scrollTop = 0
        // document.body.scrollTop = 0
      }
    },
    addTab(e){
      console.log(e)
      this.stateId=e
    },
    // 鼠标移入侧边栏触发
    add(e){
      this.a=e
    },
    // 鼠标移出侧边栏触发
    edd(){
      this.a=0;
    },
    videoadd(e){
      this.videoid=e+1
    },
    videoedd(){
      this.videoid=0
    },
    // 中职tab移入
    tab(e){
      this.istab=e
    },
    // 高职tab移入
    ddd(e){
      this.istabGz=e
    },
    // 中职列表移入css
    cdd(e){
      this.aHover=e+1
    },
    // 高职列表移入css
    gdd(e){
      this.aGzHover=e+1
    },
  },
  mounted() {
    // let boxList = document.querySelectorAll('.box')
    // window.addEventListener('scroll',scrollLoad)
    // function scrollLoad(){
    //   let taggervalue= window.innerHeight*0.98
    //   boxList.forEach(box=>{
    //     let boxTop = box.getBoundingClientRect().top
    //     // console.log(boxTop)
    //     // console.log("🚀")
    //     if (boxTop<=taggervalue){
    //       box.classList.add('show-center')
    //       // box.classList.add('animate__animated')
    //       // box.classList.add('animate__backInRight')
    //     }else{
    //       // box.classList.remove('show-center')
    //     }
    //   })
    // }

    // 悬停跑马灯的js
    (function () {
      var wrap = document.getElementById('wrap'), first = document.getElementById('first');
      var timer = window.setInterval(move, 20);
      wrap.onmouseover = function () {
        window.clearInterval(timer);
      };
      wrap.onmouseout = function () {
        timer = window.setInterval(move, 20);
      };
      function move() {
        wrap.scrollLeft++;
        if (wrap.scrollLeft >= first.scrollWidth) {
          wrap.scrollLeft = 0;
        }
      }
    })();
  },
}
</script>

<style scoped>
span{
  cursor: pointer;
}
#wrap {
  /*margin: 20px auto;*/
  white-space: nowrap;
  overflow: hidden;
  /*padding: 10px;*/
}
#wrap div {
  display: inline-block;
}
a{
  text-decoration:none;
}
.white_a{
  color: white;
}
a:link{color: white}
a:visited{color: white}
a:hover{color: white}
a:active{color: white}
.ulli li{
  list-style: none;
  display: inline-block;
  margin-left: 160px;
}
* {
  margin: 0;
  padding: 0;
}
.add span{
  color: black;
}
.uuu li{
  list-style: none;
  padding: 10px 0 0 0;
}
.uuu span:hover{
  color: #4363c9;
}
.xf>div{
  height: 25%;
  display: flex;
  justify-content:center;
  align-items: center;
}
.gd{
  width: calc(100% - 100px);
  background: url("../../assets/img/xiexian.png");
  background-size: contain;
}
.baxx{
  background: url("../../assets/img/xiexian.png");
  background-size:contain;
}
.wz_hei{
  color: #333333;
}
.wz_redbig{
  color: #cc0001 !important;
  font-size: 22px;
}
.titColor{
  color: #cc0001;
}
.titColor:hover{
  color: #255B9E;
}
.aColor{
  color: #333;;
}
.aColor:hover{
  color: #255B9E;
}
.ulp li{
  list-style: none;
  display: inline-block;
  padding: 10px 0;
}
.tab_b{
  border-bottom: 1px dashed #efefef;
}
.bor_b-5{
  border-radius: 0 0 5px 5px ;
}
.yrba{
  background-color: rgba(0, 0, 0, .4);
}
.sp_3 div{
  width: 33%;
  display:inline-block;
}
.tab_tb{
  border-top: 2px solid #0069df;
  border-bottom: 2px solid #0069df;
  box-sizing: border-box;
  color: #0069df;
  cursor: pointer;
  padding: 5px 0;
}
.sppad_l{
  margin-left: 20px;
  transition: 0.5s;
  color: #006ee1;
}

.btn-3 a {
  display: flex;
  align-items: center;
  width: 100%;
  height: 60px;
  line-height: 56px;
  color: rgb(51, 51, 51);
  text-align: center;
  font-size: 18px;
  margin-bottom: 20px;
  background-color: #fff;
  margin-top: 11px;
  box-sizing: border-box;
  position: relative;
  overflow: hidden;
  z-index: 0;
  position: relative;
  padding-left: 50px;
  transition: 0.3s linear;
}

.btn-3 a::after {
  width: 0;
  cursor: pointer;
  position: absolute;
  content: "";
  top: 0;
  bottom: 0;
  left: 0;
  z-index: -1;
  background: linear-gradient(360deg, #3991F5 0%, #3067E3 100%);
  transition: 0.3s linear;
}

.btn-3 a::before {
  content: "";
  width: 100%;
  height: 100%;
  display: inline-block;
  position: absolute;
  background: linear-gradient(90deg, #3067E3 0%, #3991F5 100%);
  left: -97%;
  top: 0;
  z-index: -1;
  transition: all .3s;
  -webkit-transition: all .3s;
  -moz-transition: all .3s;
  -o-transition: all .3s;
  -ms-transition: all .3s;
}
.ddd > div > div:hover{
  background: linear-gradient(90deg, #3067E3 0%, #3991F5 100%);
  color: white;
}
.btn-3 a:hover {
  color: white;
  text-decoration: none;
}

.btn-3 a:hover:after {
  width: 380px;
}

.btn-3 a span {
  vertical-align: middle;
}
.icon-bm {
  display: block;
  width: 32px;
  height: 28px;
  /*margin-right: 20px;*/
  background: url(../../assets/img/bm-img.png) no-repeat center center;
}
.icon-bm1 {
  display: block;
  width: 32px;
  height: 28px;
  /*margin-right: 20px;*/
  background: url(../../assets/img/bm-img1.png) no-repeat center center;
}
.icon-nj {
  display: block;
  width: 32px;
  height: 28px;
  margin-right: 20px;
  background: url(../../assets/img/icon-nj.png) no-repeat center center;
}
.icon-nj1 {
  display: block;
  width: 32px;
  height: 28px;
  margin-right: 20px;
  background: url(../../assets/img/icon-nj1.png) no-repeat center center;
}
.icon-gj {
  display: block;
  width: 32px;
  height: 28px;
  margin-right: 20px;
  background: url(../../assets/img/icon-gj.png) no-repeat center center;
}
.icon-gj1 {
  display: block;
  width: 32px;
  height: 28px;
  margin-right: 20px;
  background: url(../../assets/img/icon-gj1.png) no-repeat center center;
}

.zzbg-icon {
  display: block;
  width: 32px;
  height: 28px;
  background: url(../../assets/img/zzbg.png) no-repeat center center;
}
.zzbg-icon1 {
  display: block;
  width: 32px;
  height: 28px;
  background: url(../../assets/img/zzbg-img1.png) no-repeat center center;
}

.gzbg-icon {
  display: block;
  width: 32px;
  height: 28px;
  background: url(../../assets/img/gzbg.png) no-repeat center center;
}

.gzbg-icon1 {
  display: block;
  width: 32px;
  height: 28px;
  background: url(../../assets/img/gzbg-img1.png) no-repeat center center;
}

.jnds-icon {
  display: block;
  width: 32px;
  height: 28px;
  background: url(../../assets/img/jnds.png) no-repeat center center;
}
.jnds-icon1 {
  display: block;
  width: 32px;
  height: 28px;
  background: url(../../assets/img/jnds-img1.png) no-repeat center center;
}
.wmfc-icon {
  display: block;
  width: 32px;
  height: 28px;
  background: url(../../assets/img/wmfc.png) no-repeat center center;
}
.wmfc-icon1 {
  display: block;
  width: 32px;
  height: 28px;
  background: url(../../assets/img/wmfc-img1.png) no-repeat center center;
}
.dbli li{
  margin-left: 12px;
  margin-top: 10px;
}
img{
  /*pointer-events: none;*/
  /*-moz-user-select: none;*/
  -o-user-select: none;
  -khtml-user-select: none;
  -webkit-user-select: none;
  -ms-user-select: none;
  user-select: none;
}
*{
  -moz-user-select: none;
  -o-user-select: none;
  -khtml-user-select: none;
  -webkit-user-select: none;
  -ms-user-select: none;
  user-select: none;
}


.notice{
  /*width: 300px;*/
  height: 340px;
  /*border-radius: 8px;*/
  /*border: 1px solid #eee;*/
  /*margin: 100px auto;*/
}
.notice__inner{
  width: 100%;
  height: 100%;
  overflow: hidden;
  font-size: 16px;
  color: #666;
}
.notice__box{
  animation: roll 10s linear infinite;
}
.notice__item{
  /*height: 30px;*/
  /*line-height: 30px;*/
  height: 30px;
  flex-wrap: wrap;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 1;
  overflow: hidden;
  text-overflow: ellipsis;
  word-break: break-all;
  /*padding: 0 12px;*/
  /*white-space: nowrap;*/
}
@keyframes roll {
  0% {
    transform: translateY(0);
  }
  100% {
    transform: translateY(-300px);
  }
}
.pds>div{
  padding: 10px 0;
  height: 14px;
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 1;
  overflow: hidden;
  text-overflow: ellipsis;
  word-break: break-all;
  table-layout: fixed;
  white-space: normal;
  word-break: break-all;
}
.box{
  /*width: 1200px;*/
  /*height: 500px;*/
  /*background-color: #5296D5;*/
  /*border-radius: 8px;*/
  justify-content: center;
  align-items: center;
  margin-top: 20px;
  /*color: white;*/
  transition: transform 0.5s;
}
.ddjz>div{
  margin: 0 auto;
  margin-top: 20px;
}
.box:nth-child(even){
  transform: translateX(-200%);
}
.box:nth-child(odd){
  transform: translateX(200%);
  /*background-color: #735DE8;*/
}
.box.show-center{
  transform: translateX(0);
}
</style>
<style>
.add_bor li:before {
  content: "";
  width: 6px;
  height: 6px;
  display: inline-block;
  border-radius: 50%;
  background: white;
  vertical-align: middle;
  margin-right: 14px;
}
</style>
<style>
.wz_huihui{
  color: #989898!important;

}
</style>